const baseUrl = "http://wangsr.vip:3000/api/phones"
function init(){
    
    const currentUrl = this.location.href
    const queryObj = getQueryObj(currentUrl)
    const id = queryObj.select
    fetch(baseUrl+`?id=${id}`)
    .then(res=> res.json())
    .then(data => {
        let phoneData = data.results.users[0]
        console.log(phoneData)
        rednerDetai(phoneData)
    })
}
init()

function rednerDetai(phoneData){
    const phoneImgEle = document.querySelector('.phone-img img')
    console.log(phoneImgEle)
    const phoneTitleEle = document.querySelector('.phone-info .title')
    const phoneDescEle = document.querySelector('.phone-info .desc')
    const phonePriceEle = document.querySelector('.phone-info .price')
    phoneImgEle.src = phoneData.thumbnail
    phoneTitleEle.innerText = phoneData.title
    phoneDescEle.innerText = phoneData.desc
    phonePriceEle.innerText = phoneData.price

}

// ?select=1&a=2&b=3"
//{select:1,a:2,b:3}
function getQueryObj(url) {
    const urlObj = new URL(url)
    const search = urlObj.search.replace('?', '') //select=1&a=2&b=3
    const array = search.split('&') // ["select=1","a=2","b=3"]
    let queryObj = {}
    array.forEach(item => {
        let keyValue = item.split('=')//["select","1"]
        queryObj[keyValue[0]] = keyValue[1]
    })
    return queryObj
}

// onload = function(){
//     init()
// }